<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8" />
        <title>21_节点操作-从其他位置插入</title>
    </head>
    <body>
        <ul>
            <li id="l1">雅菲</li>
            <li>萧薰儿</li>
            <li id="l3">美杜莎</li>
            <li>云韵</li>
        </ul>

        <script>
            var ul = document.querySelector('ul');


            // 要插入的元素
            var li_new = document.createElement('li');
            li_new.innerHTML = 'action';

            // 已经存在元素
            var li_old = document.querySelector('#l1');

            ul.insertBefore(li_new,li_old);


        </script>


    </body>
</html>